<template>
	<view class="container">
		<navbar title='个人二维码' height="428rpx" background='linear-gradient(to bottom, #DFF5FE 0%, #F5F7F8 100%)'>
		</navbar>
		<view class="content" :style="{top: isH5 ? '140px' : `${120 + statusBarHeight}px`}">
			<view class="perCon">
				<image class="avter" src="/static/images/doctor-logo.png" mode=""></image>
				<text class="name">东边来的个马喽</text>
				<text class="idCard">ID：KJHG4654654</text>
				<image class="codeImage" src="/static/images/serve-default.png" mode=""></image>
				<text class="title">扫码查看主页</text>
			</view>
		</view>
	</view>
</template>

<script>
	import baseMixin from "@/mixin/baseMixin.js"
	import navMixin from "@/mixin/navMixin.js"
	export default {
		mixins: [baseMixin, navMixin],
		data() {
			return {
				
			};
		},
		methods: {
			getData() {
				
			},
		}
	};
</script>

<style lang="scss" scoped>
	.container {
		position: relative;

		.content {
			position: relative;
			width: 100%;
			z-index: 99;

			.perCon {
				width: 90%;
				margin: 0 auto;
				border-radius: 20rpx;
				margin-top: -120rpx;
				background: linear-gradient(180deg, rgba(242, 255, 252, 1) 0%, rgba(255, 255, 255, 1) 50.9%, rgba(255, 255, 255, 1) 100%);
				box-shadow: inset 0rpx 4rpx 20rpx 8rpx rgba(255, 255, 255, 0.67);
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
				padding: 32rpx 0;

				.avter {
					width: 140rpx;
					height: 140rpx;
					border-radius: 50%;
				}

				.name {
					font-size: 32rpx;
					font-weight: bold;
					margin: 20rpx 0;
				}

				.idCard {
					font-size: 28rpx;
					margin-bottom: 20rpx;
					color: rgba(54, 68, 79, 1);
				}

				.codeImage {
					width: 440rpx;
					height: 440rpx;
				}

				.title {
					margin-top: 40rpx;
					font-size: 28rpx;
				}
			}
		}
	}
</style>